// 白间模式
@bgColor-daily: #f7f8fa;
@textColor-daily: #333333;
@subTextColor-daily: #666666;
@tipsColor-daily: #CCCCCC;
@errorColor-daily: #EE6560;


// 暗夜模式
@bgColor-dark: #171B30;
@textColor-dark: #FFFFFF;
@subTextColor-dark: rgba(255, 255, 255, 0.6);
@tipsColor-dark: rgba(223, 60, 60, 0.4);

// 
body {
    background: #e7eaee;

    .header-nav {
        background: #fff;
        border-bottom: 1px solid #ddd;
    }
   
    .text {
        background: #e7eaee;
        

        b {
            border-bottom: 1px solid #eee;
            width: 90%;
        }
    }
        .play {
            background: #fff;
            border: 1px solid #ccc;
        }

        .text-two{
            background: #fff;
        }

        .search{
            background: #fff;
        }
}

// 模式切换
.styleChange(@theme) {
    // 定义显示各种颜色，拼接 主题
    transition: all .5s;
    @bgColor: 'bgColor-@{theme}';
    @textColor: 'textColor-@{theme}';
    @subColor: 'subTextColor-@{theme}';
    @tipsColor: 'tipsColor-@{theme}';
    width: 100%;

    // 设置样式
    .Height-noOpen {
        background-color: @@bgColor; // 使用@@style 双@的方法取值
    }

}


// 夜间模式
.night-mode-style {
    background-color: @@bgColor;
    color: @@textColor;

    .header-nav {
        background: @@bgColor;
        border-bottom: 1px solid hsla(0, 0%, 100%, 0.2);
    }

    .styleChange(dark);

    a {
        color: @@textColor;
    }

    .popup {
        background: @@bgColor;
        color: @@textColor;
    }
    .play{
        background: #363c48 !important;
        border: 1px solid hsla(0, 0%, 100%, 0.2);
        color: @@textColor;
    }
    .text {
        color: @@textColor;
        background: #171B30 !important;

        b {
            border-bottom: 1px solid hsla(0, 0%, 100%, 0.2);
            width: 90%;
        }
    }

    .text-two {
        color: @@textColor;
        background: #363c48 !important;
        .spans{
            span{
                border: 1px solid hsla(0, 0%, 100%, 0.2);
            }
        }
    }

    .text-one {
        color: @@textColor;
        background: #363c48 !important;
    }

    .articleLists {
        background: #363c48 !important;
        color: @@textColor;
        border: 0;
        .dl{
            border-bottom: 1px solid hsla(0, 0%, 100%, 0.2);
        }
    }
}


// 白间模式
.mode-style {
    .styleChange(dark);
}